<div class="card">
  <h4 class="card-header collapsed" data-toggle="collapse" data-target="#collapse-coupon">{{ heading_title }}</h4>
  <div id="collapse-coupon" class="collapse" data-parent="#accordion">
    <div class="card-body">
      <div class="row">
        <label class="col-md-2 col-form-label" for="input-coupon">{{ entry_coupon }}</label>
        <div class="col-md-10">
          <div class="input-group">
            <input type="text" name="coupon" value="{{ coupon }}" placeholder="{{ entry_coupon }}" id="input-coupon" class="form-control"/>
            <div class="input-group-append">
              <button type="button" id="button-coupon" data-loading-text="{{ text_loading }}" class="btn btn-primary">{{ button_coupon }}</button>
            </div>
          </div>
        </div>
      </div>
    </div>
  </div>
  <script type="text/javascript"><!--
  $('#button-coupon').on('click', function() {
	  $.ajax({
		  url: 'index.php?route=extension/total/coupon/coupon',
		  type: 'post',
		  data: 'coupon=' + encodeURIComponent($('input[name=\'coupon\']').val()),
		  dataType: 'json',
		  beforeSend: function() {
			  $('#button-coupon').button('loading');
		  },
		  complete: function() {
			  $('#button-coupon').button('reset');
		  },
		  success: function(json) {
			  $('.alert-dismissible').remove();

			  if (json['error']) {
				  $('#collapse-coupon .card-body').prepend('<div class="alert alert-danger alert-dismissible"><i class="fas fa-exclamation-circle"></i> ' + json['error'] + ' <button type="button" class="close" data-dismiss="alert">&times;</button></div>');
			  }

			  if (json['redirect']) {
				  location = json['redirect'];
			  }
		  },
		  error: function(xhr, ajaxOptions, thrownError) {
			  alert(thrownError + "\r\n" + xhr.statusText + "\r\n" + xhr.responseText);
		  }
	  });
  });
  //-->
  </script>
</div>
